<template>
    <div class="">
        <div class="system-user-search mb15">
				<el-input size="default" placeholder="请输入患者名称或id" v-model="nameandid" style="max-width: 180px"> </el-input>
				<el-button size="default" type="primary" @click="list()" class="ml10">
					<el-icon>
						<ele-Search />
					</el-icon>
					查询
				</el-button>
				<el-button size="default" type="success" @click="onOpenAddPati()" class="ml10">
					<el-icon>
						<ele-FolderAdd />
					</el-icon>
					新增消费
				</el-button>
			</div>
      <el-table
    :data="pagination.records"
    border 
    style="width: 100%">
    <el-table-column  fixed prop="patients.ptCard"  label="病人编号"   width="350"></el-table-column>
    <el-table-column fixed prop="patients.ptName" label="病人姓名"    width="300"> </el-table-column>
    <el-table-column fixed  prop="hpType"  label="消费类型"   width="300"></el-table-column>
     <el-table-column  prop="hpPrice"  label="消费金额"   width="150">  </el-table-column>
     <el-table-column prop="hpCreateTime" label="创建时间" width="420"> </el-table-column>
    <el-table-column fixed="right"  label="操作" width="100">
      <template slot-scope="scope">
     <el-button @click="del(scope.row)"  type="text" size="small">删除</el-button>
    <el-button type="text" size="small" @click="upUI(scope.row)">编辑</el-button>
      </template>
    </el-table-column>
  </el-table>
  <div class="block">
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :hide-on-single-page="true"
      :current-page="pagination.current"
		  :page-sizes="[3,5,8,10]"
		  :page-size="pagination.size"
		  layout="total,sizes, prev, pager, next, jumper"
		  :total="pagination.total">
    </el-pagination>
  </div>

  <el-dialog title="添加消费" :visible.sync="addTag" :close-on-click-modal="false">
			  <el-form :model="addPayForm" size="small" label-width="90px">
				<el-row :gutter="35">

                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
					<el-form-item label="选择患者">
						<el-select v-model="addPayForm.ptId" placeholder="请选择" style="width:100%">
                            <el-option
                            v-for="item in patientsData"
                            :key="item.ptId"
                            :label="item.ptName"
                            :value="item.ptId">
                            </el-option>
                        </el-select>
						</el-form-item>
		      </el-col>

              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
						<el-form-item label="消费类型">
							<el-input v-model="addPayForm.hpType" placeholder="请输入消费类型" clearable></el-input>
						</el-form-item>
					</el-col>


           <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24"  >
						<el-form-item label="消费金额">
							<el-input v-model="addPayForm.hpPrice" type="textarea" placeholder="请输入消费金额" clearable></el-input>
						</el-form-item>
					</el-col>

	            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
						<el-form-item label="付费状态">
							<el-switch v-model="addPayForm.hpStatus" active-value="y" inactive-value="n" inline-prompt active-text="是" inactive-text="否"></el-switch>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
      <template #footer>
				<span class="dialog-footer">
					<el-button @click="onCancel" size="default">取 消</el-button>
					<el-button type="primary" @click="onSubmit" size="default">新 增</el-button>
				</span>
			</template>
			</el-dialog>

      <el-dialog title="修改消费" :visible.sync="upTag" :close-on-click-modal="false">
			  <el-form :model="upPayForm" size="small" label-width="90px">
				<el-row :gutter="35">

                <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
					<el-form-item label="选择患者">
						<el-select v-model="upPayForm.ptId" placeholder="请选择" style="width:100%">
                            <el-option
                            v-for="item in patientsData"
                            :key="item.ptId"
                            :label="item.ptName"
                            :value="item.ptId">
                            </el-option>
                        </el-select>
						</el-form-item>
		      </el-col>

              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
						<el-form-item label="消费类型">
							<el-input v-model="upPayForm.hpType" placeholder="请输入消费类型" clearable></el-input>
						</el-form-item>
					</el-col>


           <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24"  >
						<el-form-item label="消费金额">
							<el-input v-model="upPayForm.hpPrice" type="textarea" placeholder="请输入消费金额" clearable></el-input>
						</el-form-item>
					</el-col>

	            <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12"  >
						<el-form-item label="付费状态">
							<el-switch v-model="upPayForm.hpStatus" active-value="y" inactive-value="n" inline-prompt active-text="是" inactive-text="否"></el-switch>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
      <template #footer>
				<span class="dialog-footer">
					<el-button @click="uponCancel" size="default">取 消</el-button>
					<el-button type="primary" @click="uponSubmit" size="default">新 增</el-button>
				</span>
			</template>
			</el-dialog>

    </div>
</template>

<script>
import hopay from '@/api/hopay';
export default {
    name: "doctList",
    methods:{
      //分页
        handleSizeChange(value) {
          this.pagination.size = value
          this.list(this.pagination.current,this.pagination.size);
       },
        handleCurrentChange(value) {
          this.pagination.current = value
          this.list(this.pagination.current,this.pagination.size);
       },
       del(pat){
         this.$confirm('此操作将永久删除名字为'+pat.patients.ptName+'的用户, 是否继续?', '提示', {
                    type: 'warning'
                    }).then(() => {
                        hopay.deleteHopay(pat.hpId).then(resp=>{
                             this.$message({type: 'success',message: resp.message});
                           this.list();
                        })
                    }).catch(() => {
                       this.$message({type: 'info',message: '已取消删除'});          
                    });
       } ,
   
          // 打开新增用户弹窗
		onOpenAddPati() {
             hopay.getListDto().then(resp=>{
                this.patientsData=resp.packageList;
             })
            this.addTag=true;
        },
     // 关闭新增用户弹窗
    onCancel () {
         this.addTag = false;
         this.addPayForm={};
    },

      list(pageym=1,pagesize=8){
            hopay.findHoPay(pageym,pagesize,this.nameandid).then(resp=>{
               this.pagination=resp;
            });
        },
      //添加提交
    	onSubmit() {
       hopay.addHopay(this.addPayForm).then(resp=>{
        this.$message({type: 'success',message: resp.message});
            		this.addTag=false;
                this.addPayForm={};
            		this.list();
       })
    },
      uponCancel () {
         this.upTag = false;
         this.upPayForm={};
    },
     uponSubmit () {
        hopay.upHopay(this.upPayForm).then(resp=>{
          this.$message({type: 'success',message: resp.message});
            		this.upTag=false;
            		this.upPayForm={};
            		this.list();
       })
		},
		 upUI(pat){
         hopay.upHopayui(pat.hpId).then(resp=>{
            this.upPayForm=resp;
              hopay.getListDto().then(resp=>{
                this.patientsData=resp.packageList;
             })
            this.upTag = true;
         })
       },
    },
        data() {
      return {
        pagination:{},//分页对象
        nameandid:"",//查询参数
        addTag:false,//是否显示添加弹窗
        upTag:false,
        addPayForm:{},//
        upPayForm:{},//修改医嘱
        patientsData:{},//患者列表
      }
        }
    ,  
    mounted() {
        this.list(1,8);
    },
}
</script>

<style  scoped>
</style>
